<template>
  <div class="app-container">
    <!-- 公共操作 star -->
    <breadcrumb class="margin-xs" />
    <!-- 公共操作 end -->
    <!-- 检索 start -->
    <el-filter
      size="medium"
      :data="filterInfo.data"
      :field-list="filterInfo.fieldList"
      :show-selection="false"
      @handleFilter="handleFilter"
      @handleReset="handleReset"
      @handleEvent="handleEvent"
    />
    <!-- 检索 end -->

    <batch-menu @handleCreate="handleCreate" @handleDeleteAll="handleDeleteAll" @ExcelImport="ExcelImport" @ExcelExport="ExcelExport" />

    <!-- 数据列表 start -->
    <fire-table
      ref="table"
      :list="list"
      :total="total"
      :list-loading="listLoading"
      :columns="tableColumns"
      :list-query="filterInfo.data"
      @getList="getList"
      @handleSelectionChange="handleSelectionChange"
    >
      <template slot="username" slot-scope="{ row }">
        <span>{{ row.user ? row.user.username : "" }}</span>
      </template>
      <template slot="action" slot-scope="{ row, index }">
        <el-button
          type="primary"
          size="mini"
          style="margin-right: 10px"
          @click="amend(row, index)"
        >修改</el-button>

        <el-popconfirm
          confirm-button-text="确认"
          cancel-button-text="取消"
          icon="el-icon-info"
          icon-color="red"
          title="确认删除吗?"
          @confirm="delectRow(row, index)"
        >
          <el-button slot="reference" type="danger" size="mini">删除</el-button>
        </el-popconfirm>
      </template>
    </fire-table>
    <!-- 数据列表 end -->
  </div>
</template>

<script>
import { configIndex, configDelete } from '@projectName/views/diandi_place/api/place/config'
export default {
  components: {},
  data() {
    return {
      dialogTableVisible: false,
      // 表格数据 start
      tableColumns: [
        { label: '管理员', prop: 'admin_ids' },
        {
          'label': '品牌',
          'prop': 'bloc.business_name'
        }, {
          'label': '店铺',
          'prop': 'store.name'
        },
        { label: '会员积分比例', prop: 'mumber_scale', width: 120 },
        {
          label: '订单下单小程序订阅模板',
          prop: 'order_create_template',
          width: 180
        },
        {
          label: '订单到期小程序订阅模板',
          prop: 'order_end_template',
          width: 180
        },
        { label: '充值成功通知模板', prop: 'recharge_template', width: 180 },
        { label: '续费通知模板', prop: 'renew_template', width: 120 },
        { label: '短信通知手机号，逗号隔开', prop: 'sms_mobiles', width: 180 },
        { label: '短信订单通知签名', prop: 'sms_order_sign', width: 150 },
        { label: '短信订单通知模板', prop: 'sms_order_template', width: 150 },
        { label: '商户简介', prop: 'store_introduce' },
        { label: '首页图片', prop: 'index_thumb', width: 200 },
        { label: 'vip积分比例', prop: 'vip_scale', width: 120 },
        {
          label: '操作',
          slot: 'action',
          fixed: 'right',
          width: 200
        }
      ],
      // 表格数据end
      // 检索 start
      filterInfo: {
        data: {
          page: 1,
          pageSize: 10
        },
        fieldList: [
          {
            label: '管理员',
            type: 'input',
            value: 'HotelConfigSearch[admin_ids]'
          }
        ]
      },
      total: 0,
      list: [],
      excelList: []
    }
  },
  created() {
    this.getList()
  },
  methods: {
    handleSelectionChange(val) {
      console.log('传递来的', val)
    },
    handleRequestSuccess() {},
    selectType(val) {
      console.log(val)
    },
    getList() {
      const that = this
      that.listLoading = true
      configIndex(that.filterInfo.data).then((response) => {
        that.total = response.data.dataProvider.total
        that.list = response.data.dataProvider.allModels
        console.log('列表数据层级测试', that.list)
        that.listLoading = false
      })
    },
    //  搜索
    handleFilter(row) {
      const that = this
      console.log(row)
      that.$set(that.filterInfo, 'data', row)
      console.log('检索前', that.filterInfo.data)
      that.getList()
    },
    handleReset(row) {
      this.getList()
    },
    handleEvent(row) {
      console.log(row)
    },
    handleModifyStatus(row, status) {
      this.$message({
        message: '操作Success',
        type: 'success'
      })
      row.status = status
    },
    // 修改
    amend(row) {
      this.$router.push({
        name: 'diandi-place-place-config-update',
        params: {
          id: row.id,
          rowData: row
        }
      })
    },
    handleCreate() {
      this.$router.push({
        name: 'diandi-place-place-config-create'
      })
    },
    // 删除
    delectRow(row) {
      const that = this
      configDelete(row.id).then((response) => {
        that.dialogFormVisible = false
        if (response.code === 200) {
          this.$message.success(response.message)
          that.getList()
        } else {
          this.$message.error(response.message)
        }
      })
    },
    handleChange(value) {
      console.log(value)
    }
  }
}
</script>
<style scoped>
.active {
  color: #fff;
  background-color: #409eff;
}
.isActive {
  color: #fff;
  background-color: #9ca1a1;
}
</style>
s
